<template>

    <div>
        test page
        <a v-on:click="get_iframe_content()" >123</a>
        <iframe  id="video" src="http://shop.cloud.com/frontend/index.html" frameborder="0"></iframe>


        ---------------
        <input id="test-file" type="file">
        <img id='img' src="" alt="">
    </div>

</template>

<script>
    export default {
        name: "test",
        data:function(){
            return {

            }
        },

        methods:{

            get_iframe_content:function(){

                // document.domain = "jiaju.com";

                var iframe = document.getElementById('video').contentWindow;

                console.log( iframe );

                var body = iframe.document.getElementsByTagName('body');

                console.log( body );

            },

            test_blob:function(){

                $('#test-file').change(function( data ){

                    console.log( data );
                    // var img = data.files[0];
                    console.log( this.files[0] );
                    var img_file = this.files[0];

                    var reader = new FileReader();
                    img =$('#img');
                    reader.readAsArrayBuffer( img_file );
                    reader.onload = function(){
                        var bf = this.result;
                        // var blob = new Blob([bf],{type:"text/plain"});
                        var blob = new Blob([bf],{type:"image/png"});
                        console.log(blob);
                        var str = URL.createObjectURL(blob);
                        img.src = str;

                    };

                });

            }

        },
        created:function(){

            this.test_blob();
        }
    }
</script>

<style scoped>

</style>